<template>
    <div>
        <input type="text" class="myinput">
        <n-button @click="activate('right')">
            新增
        </n-button>
    </div>
    <n-drawer v-model:show="active" :width="502" :placement="placement">
        <n-drawer-content title="新增">
            <NewText></NewText>
        </n-drawer-content>
    </n-drawer>
</template>

<script setup>
import { ref } from "vue";
import NewText from "./NewText.vue";

const active = ref(false);
const placement = ref("right");
const activate = (place) => {
    active.value = true;
    placement.value = place;
};
</script>

<style scoped>
.myinput{
    width: 140px;
    margin: 0 20px;
}
</style>